import { Drawer, Typography, Button, Tooltip } from "antd";
import { QuestionCircleOutlined } from "@ant-design/icons";
import Connect from "../Connect";
import Users from "./Users";

const { ipcRenderer } = window.electron;

export default class Setting extends React.PureComponent {
  componentDidMount() {
    // console.log("this.state.config:", config);
  }

  showConnect = () => {
    ipcRenderer.send("showConnect");
  };

  showUsers = () => {
    ipcRenderer.send("showUsers");
  };

  render() {
    const { visible, onClose } = this.props;
    return (
      <React.Fragment>
        <Drawer
          closable={false}
          getContainer=".main-frame"
          onClose={onClose}
          style={{ position: "absolute" }}
          title="设置"
          visible={visible}
        >
          <Typography.Text strong>连接：</Typography.Text>
          <div className="my-5">
            <Button type="primary" onClick={this.showConnect}>
              设置OSS登录信息
            </Button>
            <Tooltip title="在线读取log文件的登录信息，请确保登录账户拥有日志文件读权限">
              <QuestionCircleOutlined className="ml-3" />
            </Tooltip>
          </div>
          <Typography.Text strong>统计配置：</Typography.Text>
          <div className="my-5">
            <Button type="primary" onClick={this.showUsers}>
              配置用户信息
            </Button>
            <Tooltip title="统计的时候，会显示配置的用户备注，而不是用户uid">
              <QuestionCircleOutlined className="ml-3" />
            </Tooltip>
          </div>
        </Drawer>
        <Connect />
        <Users />
      </React.Fragment>
    );
  }
}
